import 'package:flutter/material.dart';
// ignore: import_of_legacy_library_into_null_safe
import 'package:flutter_swiper/flutter_swiper.dart';
import '../../Config/ScreenAdaper.dart';
import '../M/FocusModel.dart';
import 'dart:convert';
import 'package:dio/dio.dart';
class HomeController extends StatefulWidget {
  const HomeController({Key? key}) : super(key: key);

  @override
  _HomeControllerState createState() => _HomeControllerState();
}
class _HomeControllerState extends State<HomeController> {
  List _focusData=[];
  @override
  void initState() {
    super.initState();
    // 引入import 'dart:convert';
    // var strData='{"name":"张三","age":20}';
    // // print(json.decode(strData)); //Json字符串转化成Map类型

    // var str='{"_id":"59f6ef443ce1fb0fb02c7a43","title":"笔记本电脑 ","status":"1"," url":"12" }';
    //
    // var focus=new FocusModel.fromJson(json.decode(str));
    //
    // print(focus.sId);
    //
    // print(focus.title);
    _getFocusData();
  }
  _getFocusData() async{

    var api = 'http://jd.itying.com/api/focus';
    //get请求
    var result = await Dio().get(api);
    var focusList = FocusModel.fromJson(result.data);

    setState(() {
      this._focusData = focusList as List;
    });

  }


  //轮播图
  Widget _swiperWidget(){
    List<Map> imgList = [
      {"url":"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fcar0.autoimg.cn%2Fupload%2Fspec%2F547%2Fu_547871141841.jpg&refer=http%3A%2F%2Fcar0.autoimg.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1626489444&t=c394e7139089782d5c6907162b421ab2"},
      {"url":"https://img2.baidu.com/it/u=3355464299,584008140&fm=26&fmt=auto&gp=0.jpg"},
      {"url":"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fcdn.duitang.com%2Fuploads%2Fitem%2F201409%2F06%2F20140906020558_h4VfY.png&refer=http%3A%2F%2Fcdn.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1626489338&t=ec6a483003f834504678a53220baf695"}
    ];
    //
    if(this._focusData.length>0){
      return Container(
        child: AspectRatio(
            aspectRatio: 2/1,
            child: Swiper(
              itemBuilder: (BuildContext context,int index){
                String pic=this._focusData[index].pic;
                // return new Image.network(imgList[index]["url"],fit: BoxFit.fill,);

                return new Image.network("http://jd.itying.com/${pic.replaceAll('\\', '/')}",fit: BoxFit.fill,);
              },
              itemCount: this._focusData.length,
              pagination: new SwiperPagination(),
              // control: new SwiperControl(), //左右光标
              autoplay: true,
            )
        ),
      );
    }else{
      // return Text('加载中...');
      return Container(
        child: AspectRatio(
            aspectRatio: 2/1,
            child: Swiper(
              itemBuilder: (BuildContext context,int index){
                return new Image.network(imgList[index]["url"],fit: BoxFit.fill,);
              },
              itemCount: imgList.length,
              pagination: new SwiperPagination(),
              // control: new SwiperControl(), //左右光标
              autoplay: true,
            )
        ),
      );
    }


  }

  Widget _titleWidget(value){
    return Container(
      height: ScreenAdaper.height(32),
      margin: EdgeInsets.only(left: 10),
      padding: EdgeInsets.only(left: 10),
      //decoration装饰 BoxDecoration：盒子类型装饰
      decoration: BoxDecoration(
        border: Border(
          left: BorderSide(
            color: Colors.red,
            width: ScreenAdaper.width(10)
          )
        )
      ),
      child: Text(value,style: TextStyle(
        color: Colors.black54
      )),
    );
  }



  //猜你喜欢
  Widget _hotProductListWidget(){
    return Container(
        height: ScreenAdaper.height(234),
        padding: EdgeInsets.all(ScreenAdaper.width(20)),
        // width: double.infinity,
        child: ListView.builder(
          scrollDirection: Axis.horizontal,
          itemBuilder: (contxt,index){
           return Column(
             children: <Widget>[
               Container(
                   height: ScreenAdaper.height(140),
                   width: ScreenAdaper.width(140),
                   //每个单元格间距21
                   margin: EdgeInsets.only(right: ScreenAdaper.width(21)),
                   child:Image.network("https://img2.baidu.com/it/u=3355464299,584008140&fm=26&fmt=auto&gp=0.jpg")
               ),
               Container(
                 padding: EdgeInsets.only(top:ScreenAdaper.height(10)),
                 height: ScreenAdaper.height(44),
                 child: Text("第${index}条"),
               )

             ],
           );
        },
        itemCount: 10,
       )
    );
  }


  //热门推荐
  _recProductItemWidget() {
    //单个按钮宽度
    var itemWidth = (ScreenAdaper.screenWidth() - 30) / 2;
    return Container(
      padding: EdgeInsets.all(10),
      width: itemWidth,
      decoration: BoxDecoration(
        border:
            //边框
          Border.all(color: Color.fromRGBO(233, 233, 233, 0.9))
      ),
      child: Column(
          //Column垂直布局  row水平
        children: <Widget>[
          Container(
            width: double.infinity,//可以强制在宽度上撑满
            child: AspectRatio( //防止服务器返回的图片大小不一致导致高度不一致问题
              aspectRatio: 1/1,
              child: Image.network("https://img2.baidu.com/it/u=3355464299,584008140&fm=26&fmt=auto&gp=0.jpg",fit: BoxFit.cover),
            ),
          ),
          Padding(
            padding: EdgeInsets.only(top: ScreenAdaper.height(20)),
            child: Text(
              "2019夏季新款气质高贵洋气阔太太有女人味中长款宽松大码",
              maxLines: 2,
              style: TextStyle(color: Colors.black54),
              overflow: TextOverflow.ellipsis,
            ),
          ),
          Padding(
            padding: EdgeInsets.only(top: ScreenAdaper.height(20)),
            child: Stack(
              children: [
                Align(
                  alignment: Alignment.centerLeft,
                  child: Text(
                    "￥10000",
                    style: TextStyle(color: Colors.red,fontSize: 16),
                  )
                ),
                Align(
                  alignment: Alignment.centerRight,
                  child: Text("¥198.0",
                      style: TextStyle(
                          color: Colors.black54,
                          fontSize: 14,
                          decoration: TextDecoration.lineThrough)),
                )
              ],
            ),
          )
        ],
      ),
    );


  }



  @override
  Widget build(BuildContext context) {
    //初始化屏幕适配控件
    ScreenAdaper.init(context);


    return ListView(
      children: [
        //轮播图
        _swiperWidget(),

        SizedBox(height: 10),
        _titleWidget("猜你喜欢"),
        _hotProductListWidget(),

        SizedBox(height: 10),
        _titleWidget("热门推荐"),
        //热门
        Container(
          padding: EdgeInsets.all(10),
          //Wrap自动换行控件
          child: Wrap(
            runSpacing: 10,//交叉轴上子控件之间的间距
            spacing: 10, //主轴上子控件中间的间距
            children: [
              _recProductItemWidget(),
              _recProductItemWidget(),
              _recProductItemWidget(),
              _recProductItemWidget(),
              _recProductItemWidget(),
            ],
          ),
        )

      ],
    );
  }
}



